<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>demo15-dom查找</title>
    <script src="http://libs.baidu.com/jquery/1.9.1/jquery.min.js"></script>
    <style>

    </style>

</head>
<body>
<div id="outer" style="position: relative">outer
    <div id="wap" style="position: absolute;left:10px;top: 20px">
        wrap
        <p id="p1">我是第1个p标签</p>

        <p id="p2">我是<span>第2个p标</span>签</p>

        <p>我是第3个p标签</p>

        <div>我是div标签</div>
        <p class="targetP">我是target1</p>
        <p class="targetP">我是target2</p>
        <p class="targetP">我是target3</p>
    </div>
</div>
</body>
</html>

<script>

    $('#wap').children('p').css('background','red');

    $('#p1').parent().css('border','1px solid #ccc');

    $('#p1').parents('#outer').css('border','1px solid #f00');


    $('#p1').offsetParent().css('border','5px solid #aaa');

    $('#p1').next().css('background','green');

    $('#p1').nextAll('.targetP').eq(0).css('background','yellow');


    $("#p2").siblings().css('background','gray');

    $('span').parent().css('background','yellow').end().css('background','gray');

</script>